import React, {useEffect, useState} from "react";
import {Spin} from "antd";
import Query from './query'
import './index.scss'
import StickyContainer from "@/components/Sticky/StickyContainer";
import Content from './content'
import FuncGroup from './FuncGroup/FuncGroup'
import EventTypeStore from "@/common/store/EventTypeStore";
import CameraInfoStore from "@/common/store/CameraInfoStore";
import FusionStore from "@/pages/radar/store/FusionStore";
import EventsStore from "@/pages/radar/store/EventsStore";

const EventListContainer: React.FC<any> = (props) => {
  // const groupCode = getRouteMatchParam(props, "groupCode");
  const [loading, setLoading] = useState<boolean>(false)

  useEffect(() => {
    EventTypeStore.getEventTypes()
    CameraInfoStore.queryCameraInfos()
    FusionStore.queryCalibrateList()
    EventsStore.queryEvents()
  }, []);

  return (
    <div className="eventContainer">
      <Spin spinning={loading}>
        <Query/>
        <StickyContainer scrollDom={() => document.getElementById("main_layout")}>
          <FuncGroup {...props} total={0}/>
          <Content/>
        </StickyContainer>
      </Spin>
    </div>
  )
}

export default EventListContainer
